<template>
  <div>
    <cfg-table
      ref="table"
      :columns="columns"
      :data="data"
      :loading="loading"
      :config="config"
      :pageSizeOpts="pageSizeOpts"
      :pageNavigation="pageNavigation"
      :queryFormItem="queryFormItem"
      :collapseFormItem="collapseFormItem"
      @loadPage="loadPage"
      @handleCreate="handleCreate"
      @handleDetail="handleDetail"
      @handleEdit="handleEdit"
      @handleDelete="handleDelete"
      @handleDeleteMultiple="handleDeleteMultiple"
      @handleSearch="handleSearch"
      @handleReset="handleReset"
    ></cfg-table>
    <new-add-modal
      v-bind="addNewPanel"
      ref="addModal"
      :modelType="modelType"
      :columns="formColumns"
      :rules="rules"
      @submit="handleNewAddSubmit"
    ></new-add-modal>
    <edit-modal
      v-bind="editPanel"
      :modelType="modelType"
      :columns="formColumns"
      :rules="rules"
      @submit="handleEditSubmit"
    ></edit-modal>
    <read-modal
      v-bind="readPanel"
      :modelType="modelType"
      :columns="columns"
      :rules="rules"
    ></read-modal>
    <bind-person
        :personPanel="selectPanel"
        :isSingleCheck="isSingleCheck"
        :selectionData="selectionData"
        @submit="submitSingleCheck">
    ></bind-person>
    <!-- 隔级领导 -->
    <bind-person
        :personPanel="selectAcrossPanel"
        :isSingleCheck="isSingleCheck"
        :selectionData="selectionAcrossData"
        @submit="submitAcrossSingleCheck">
    ></bind-person>
  </div>
</template>

<script>
    import newAddModal from '@/pages/components/newAddModal.vue';
    import editModal from '@/pages/components/editModal.vue';
    import readModal from '@/pages/components/readModal.vue';
    import bindPerson from '@/pages/components/bindPerson.vue';
    import { typeClassName } from '@/pages/config/classNameMap';
    import mixin from '@/pages/components/mixins/mixin'
    import columnsMixin from './config'
    export default {
        components: { newAddModal, editModal, readModal,bindPerson},
        name: 'person',
        mixins: [mixin,columnsMixin],
        data () {
            return {
                classObject: null, // 单个人员实例
                collectionObject: null, // 所有人员实例
                positionClassObject: null, // 所有职级实例
                jobClassObject: null, // 所有岗位实例
                positionOptions: [], // 职级信息，下拉框使用
                className: typeClassName['person'].className,
                type: typeClassName['person'].type,
                modelType: typeClassName['person'].modelType,
                deptClassObject: null, // 部门
                teamClassObject: null, // 班组
                educationOptions: [
                    {label:'初中及以下',value:'0'},
                    {label:'高中/中专',value:'1'},
                    {label:'大专',value:'2'},
                    {label:'本科',value:'3'},
                    {label:'硕士',value:'4'},
                    {label:'博士',value:'5'},
                ],
                genderOptions:[{ label: '男', value: 'male' }, { label: '女', value: 'female' }],
                statusOptions:[{ label: '在职', value: '1' }, { label: '离职', value: '0' }],
                jobOptions: [], // 所属岗位/主岗名称，下拉框使用
                leaderFlag:'0',  //直属领导0 or 隔级领导1
                addNewPanel: {
                    width: 1024,
                    zIndex: 100,
                    titleStyle: {},
                    drawer: {
                        show: false
                    },
                    cols: 2
                },
                editPanel: {
                    width: 1024,
                    zIndex: 100,
                    titleStyle: {},
                    drawer: {
                        show: false
                    },
                    cols: 2,
                    data: {}
                },
                readPanel: {
                    width: 1024,
                    zIndex: 100,
                    titleStyle: {},
                    drawer: {
                        show: false
                    },
                    cols: 2,
                    data: {}
                },
                selectPanel: {
                    width: 1024,
                    zIndex: 1001,
                    titleStyle: {},
                    drawer: {
                        show: false
                    },
                    cols: 2,
                    data: {}
                },
                selectAcrossPanel: {
                    width: 1024,
                    zIndex: 1001,
                    titleStyle: {},
                    drawer: {
                        show: false
                    },
                    cols: 2,
                    data: {}
                },
                isSingleCheck: true,
                selectionData: [],
                selectionAcrossData: [],
                rules: {
                    sf_code: [
                        { required: true, message: '不能为空', trigger: 'blur' },
                        { max: 50, message: '编码长度不能超过50', trigger: 'blur'}
                    ],
                    sf_name: [
                        { required: true, message: '不能为空', trigger: 'blur' },
                        { max: 200, message: '姓名长度不能超过200', trigger: 'blur'}
                    ],
                    gender: [
                        { required: true, message: '不能为空', trigger: 'blur' }
                    ],
                    jobCode: [
                        { required: true, message: '不能为空', trigger: 'blur' }
                    ],
                    status: [
                        { required: true, message: '不能为空', trigger: 'blur' }
                    ],
                    email: [
                        {type: 'email', message: '请输入正确的邮箱地址', trigger: 'blur'}
                    ],
                    // sf_idNumber: [
                    //   { max: 200, message: '身份证号不能超过200', trigger: 'blur'},
                    //   { pattern: /(^\d{15})|(\d18)|(\d18)|(^\d{17}(\d|X|x)$)/, message: '请输入合法的身份证号', trigger: 'blur'}
                    // ],
                    remark: [
                      { max: 500, message: '请不要超出500个字符', trigger: 'blur'}
                    ]
                },
                loading: false,
                config: {
                    search: true,
                    addButton: true,
                    batchDeleteButton: true,
                    tableSizeIcon: true,
                    fullscreenIcon: true,
                    refreshIcon: false,
                    columnSettingIcon: true,
                    action: true,
                    additionalAction: false
                },
                pageSizeOpts: [10, 30, 50, 100],
                pageNavigation: { total: 0, pageSize: 10, pageNumber: 1 }
            };
        },
        computed:{
            additionalAction () {
                return [];
            },
            data () {
            if (!!this.collectionObject) {
                return this.collectionObject.records.map(d => {
                    return {
                        ...d,
                        ...d.values
                    }
                })
            } else {
                return [];
            }
            }
        },
        created () {
            this.collectionObject = this.$modelObject.create(`${this.modelType}Collection`);
            this.classObject = this.$modelObject.create(this.modelType);
            this.positionClassObject = this.$modelObject.create(`${typeClassName['position'].modelType}`);
            this.jobClassObject = this.$modelObject.create(`${typeClassName['job'].modelType}`);
            this.deptClassObject = this.$modelObject.create(`${typeClassName['dept'].modelType}`);
            this.teamClassObject = this.$modelObject.create(`${typeClassName['team'].modelType}`);
            this.loadPage(this.pageNavigation, null);
            //获取部门
            this.getCommon('dept',this.deptClassObject)
            this.getCommon('team',this.teamClassObject)
            this.setOptionsByHier('position', this.positionClassObject, 'positionOptions', {
                label: 'sf_name', value: 'sf_code'
            })
            this.setOptionsByHier('job', this.jobClassObject, 'jobOptions', {
                label: 'sf_name', value: 'sf_code'
            })
        },
        methods: {
            getCommon(className,classObject){
                let filter = {
                    className: typeClassName[className].className,
                    type: typeClassName[className].type
                }
                let newFilter = '';
                if (this.tools.isReal(filter)) {
                    newFilter = classObject.util.getFilter(filter);
                }
                classObject.query(newFilter)
            },
            /**
             * 查看框数据的处理
             */
            readDataCondition(data){
                let basicData = data.others.basic || [];
                // 所属部门
                let deptName = '';
                // 所属班组
                let teamName = '';
                basicData.forEach(item => {
                    if (item.pointer.className === typeClassName['dept'].className) {
                        deptName = this.deptClassObject.getOtherFatherById(item.id)['sf_name']
                    } else if (item.pointer.className === typeClassName['team'].className) {
                        teamName = this.teamClassObject.getOtherFatherById(item.id)['sf_name']
                    }
                })
                data.deptName = deptName
                data.teamName = teamName
                // 职级
                data.positionName = this.getOptionValue(this.positionOptions, data.positionName)
                // 所属岗位
                data.jobCode = this.getOptionValue(this.jobOptions, data.jobCode)
                data.majorCode = this.getOptionValue(this.jobOptions, data.majorCode)
                data.isSafetyCertificate = this.getOptionValue([{ label: '是', value: 'yes' }, { label: '否', value: 'no' }], data.isSafetyCertificate)
                data.isSpecialCertificate = this.getOptionValue([{ label: '是', value: 'yes' }, { label: '否', value: 'no' }], data.isSpecialCertificate)
            },
            // 打开绑定直属领导弹框
            selectDirectLeader () {
                this.$set(this.selectPanel.drawer, 'show', true)
                this.leaderFlag = '0';
            },
            // 打开绑定隔级领导弹框
            selectAccessLeader () {
                this.$set(this.selectAcrossPanel.drawer, 'show', true)
                this.leaderFlag = '1';
            },
            //绑定直属领导确认
            submitSingleCheck(selection){
                let row = selection[0]||{}
                this.selectionData = [row]
                let leaderObj = {directLeaderName:row.label,directLeaderCode:row.code,directLeaderId:row.id}
                this.submitCheck(leaderObj)
            },
            //隔级领导确认
            submitAcrossSingleCheck(selection){
                let row = selection[0]||{}
                this.selectionAcrossData = [row]
                let leaderObj = { acrossLeaderName:row.label, acrossLeaderCode:row.code,acrossLeaderId:row.id}
                this.submitCheck(leaderObj)
            },
            submitCheck(leaderObj){
                if (this.addNewPanel.drawer.show) {
                    let newValues = {...this.$refs.addModal.data.values,...leaderObj}
                    this.$set(this.$refs.addModal.data, 'values',newValues);
                    this.$set(this.selectPanel.drawer, 'show', false)
                    this.$set(this.selectAcrossPanel.drawer, 'show', false)
                } else if (this.editPanel.drawer.show) {
                    let data = { ...this.editPanel.data }
                    data.values = {...data.values,...leaderObj}
                    this.$set(this.editPanel, 'data', data);
                    this.$set(this.editPanel.drawer, 'show', false)
                    this.$set(this.selectPanel.drawer, 'show', false)
                    this.$set(this.selectAcrossPanel.drawer, 'show', false)
                    this.$nextTick(() => {
                        this.$set(this.editPanel.drawer, 'show', true)
                    })
                }
            },
            handleCreate () {
                this.selectionData = [];
                this.selectionAcrossData = [];
                this.$set(this.addNewPanel.drawer, 'show', true);
            },
            /**
             * 编辑弹框打开条件
             * 执行隔级领导/直属领导选择框selectionData
             */
            editPanelOpenCondition(data){
                let flag = true;
                let values = data.values || {};
                this.selectionData =  [{label:values.directLeaderName,value:values.directLeaderCode,id:values.directLeaderId}]
                this.selectionAcrossData = [{label:values.acrossLeaderName,value:values.acrossLeaderCode,id:values.acrossLeaderId}]
                return flag;
            }
        }
    };
</script>
<style scoped lang="scss"></style>
